import React, { Component } from 'react'
import { Swiper, Image } from 'react-vant';
import axios from "axios"
export const images = [
  'https://img.yzcdn.cn/vant/apple-1.jpg',
  'https://img.yzcdn.cn/vant/apple-2.jpg',
  'https://img.yzcdn.cn/vant/apple-3.jpg',
  'https://img.yzcdn.cn/vant/apple-4.jpg',
  'https://img.yzcdn.cn/vant/apple-5.jpg',
  'https://img.yzcdn.cn/vant/apple-6.jpg',
  'https://img.yzcdn.cn/vant/apple-7.jpg',
  'https://img.yzcdn.cn/vant/apple-8.jpg',
];
export class findHouse extends Component {
  constructor(props) {
    super(props)
  
    this.state = {
      jianlist:[]
    }
  }
  componentDidMount() { 
    axios.get("/jian").then((res)=>{
      this.setState({
        jianlist:res.data
      })
    })
    
   }
  render() {
    const { jianlist}=this.state
    return (
      <div >
      <Swiper autoplay={1000}>
        { images? images.map((image) => (
          <Swiper.Item key={image}>
            <Image lazyload src={image} />
          </Swiper.Item>
        )) :'暂无数据'}
      </Swiper>
     <ul className='jian'>
      {  jianlist ? jianlist.map((item,index)=>{
               return <li style={{background:`#${jianlist.length-index}${ jianlist.length-index}${jianlist.length-index}`} }>{item.title}</li>

      }) :'暂无数据'
          
      }
     </ul>

    </div>
    )
  }
}

export default findHouse